// 导航和页面切换功能

// 页面切换
function switchPage(pageId) {
    console.log(`🔄 调用switchPage: ${pageId}`);

    // 付费下载区需要密码验证
    if (pageId === 'vmq') {
        // 显示密码验证弹窗
        if (typeof verifyPremiumPassword === 'function') {
            verifyPremiumPassword(function(success) {
                if (success) {
                    // 密码验证成功，继续切换页面
                    performPageSwitch(pageId);
                } else {
                    // 密码验证失败，不切换页面
                    console.log('❌ 密码验证失败，取消页面切换');
                    return;
                }
            });
        } else {
            console.error('❌ verifyPremiumPassword函数未找到');
            // 如果验证函数不存在，直接切换页面
            performPageSwitch(pageId);
        }
    } else {
        // 其他页面直接切换
        performPageSwitch(pageId);
    }
}

// 确保函数在全局作用域中可用
window.switchPage = switchPage;

// 执行页面切换
function performPageSwitch(pageId) {
    console.log(`🔄 开始切换页面: ${pageId}`);
    
    // 更新菜单状态
    document.querySelectorAll('.menu-item').forEach(item => {
        item.classList.remove('active');
    });
    
    // 找到对应的菜单项并激活 - 使用更可靠的选择器
    const menuItems = document.querySelectorAll('.menu-item');
    let targetMenuItem = null;
    
    menuItems.forEach(item => {
        const onclick = item.getAttribute('onclick');
        if (onclick && onclick.includes(`switchPage('${pageId}')`)) {
            targetMenuItem = item;
        }
    });
    
    if (targetMenuItem) {
        targetMenuItem.classList.add('active');
        console.log(`✅ 菜单项已激活: ${pageId}`);
    } else {
        console.warn(`⚠️ 未找到对应的菜单项: ${pageId}`);
    }
    
    // 更新页面内容
    document.querySelectorAll('.page').forEach(page => {
        page.classList.remove('active');
    });

    // 隐藏所有vmq子页面内容
    document.querySelectorAll('.vmq-content').forEach(content => {
        content.classList.remove('active');
    });
    
    // 页面ID映射
    const pageMap = {
        'douyin': 'douyinPage',
        'kuaishou': 'kuaishouPage',
        'bilibili': 'bilibiliPage',
        'vmq': 'vmqPage',
        'settings': 'settingsPage',
        'help': 'helpPage'
    };

    const targetPage = document.getElementById(pageMap[pageId]);
    if (targetPage) {
        targetPage.classList.add('active');
        console.log(`✅ 页面已切换: ${pageId} -> ${pageMap[pageId]}`);

        // 如果切换到VMQ页面，默认激活第一个子页面（单页下载）
        if (pageId === 'vmq') {
            console.log('🎯 切换到VMQ页面，激活默认子页面');
            // 使用setTimeout确保页面DOM已经更新
            setTimeout(() => {
                switchVmqMode('single');
            }, 50);
        }

        // 重新初始化数据流特效（修复滚动背景问题）
        setTimeout(() => {
            if (typeof reinitDataStreamEffects === 'function') {
                reinitDataStreamEffects();
                console.log('🌊 数据流特效已重新初始化');
            } else if (typeof initDataStreamEffects === 'function') {
                initDataStreamEffects();
                console.log('🌊 数据流特效已初始化');
            }
        }, 100);

    } else {
        console.error(`❌ 页面元素未找到: ${pageMap[pageId]}`);
        // 尝试查找所有页面元素进行调试
        const allPages = document.querySelectorAll('.page');
        console.log('🔍 当前所有页面元素:', Array.from(allPages).map(p => p.id));
    }
}

// 付费下载区模式切换
function switchVmqMode(mode, event) {
    console.log(`🔄 切换VMQ模式: ${mode}`);

    // 阻止事件冒泡
    if (event) {
        event.preventDefault();
        event.stopPropagation();
    }

    // 只操作付费解析区页面内的标签
    const vmqPage = document.getElementById('vmqPage');
    if (!vmqPage) {
        console.error('❌ 找不到vmqPage元素');
        return;
    }

    // 更新标签状态 - 只在当前页面内查找
    const tabs = vmqPage.querySelectorAll('.nav-tab');
    tabs.forEach(tab => {
        tab.classList.remove('active');
    });

    // 激活当前标签
    if (event && event.target) {
        event.target.classList.add('active');
    } else {
        // 如果没有event，根据mode找到对应的标签
        const tabMap = {
            'single': 0,
            'batch': 1,
            'tiefenquan': 2,
            'tiefenquan-video': 3
        };
        if (tabs[tabMap[mode]]) {
            tabs[tabMap[mode]].classList.add('active');
        }
    }

    // 更新内容显示 - 先隐藏所有内容
    document.querySelectorAll('.vmq-content').forEach(content => {
        content.classList.remove('active');
    });

    // 内容ID映射
    const contentMap = {
        'single': 'vmqSingle',
        'batch': 'vmqBatch',
        'tiefenquan': 'vmqTiefenquan',
        'tiefenquan-video': 'vmqTiefenquanVideo'
    };

    const targetContentId = contentMap[mode];
    console.log(`🎯 目标内容ID: ${targetContentId}`);

    const targetContent = document.getElementById(targetContentId);
    console.log(`🔍 找到目标元素:`, !!targetContent);

    if (targetContent) {
        // 直接添加active类，不使用setTimeout
        targetContent.classList.add('active');
        console.log(`✅ 成功激活内容: ${targetContentId}`);

        // 验证激活状态
        const isActive = targetContent.classList.contains('active');
        const displayStyle = getComputedStyle(targetContent).display;
        console.log(`📊 激活验证:`, { isActive, displayStyle });
    } else {
        console.error(`❌ 找不到内容元素: ${targetContentId}`);
        // 列出所有vmq-content元素
        const allVmqContents = document.querySelectorAll('.vmq-content');
        console.log('🔍 所有vmq-content元素:', Array.from(allVmqContents).map(el => el.id));
    }

    console.log(`✅ VMQ模式切换完成: ${mode} -> ${targetContentId}`);
}

// 设置页面标签切换
function switchSettingsTab(tab, event) {
    console.log(`🔄 切换设置标签: ${tab}`);

    // 只操作设置页面内的标签
    const settingsPage = document.getElementById('settingsPage');
    if (!settingsPage) {
        console.error('❌ 找不到settingsPage元素');
        return;
    }

    // 更新标签状态 - 只在当前页面内查找
    const tabs = settingsPage.querySelectorAll('.nav-tab');
    tabs.forEach(tabEl => {
        tabEl.classList.remove('active');
    });

    // 激活当前标签
    if (event && event.target) {
        event.target.classList.add('active');
    }

    // 更新内容显示
    document.querySelectorAll('.settings-content').forEach(content => {
        content.classList.remove('active');
    });

    // 内容ID映射
    const contentMap = {
        'proxy': 'proxySettings',
        'cookies': 'cookieSettings',
        'password': 'passwordSettings',
        'advanced': 'advancedSettings'
    };

    const targetContent = document.getElementById(contentMap[tab]);
    if (targetContent) {
        targetContent.classList.add('active');
        console.log(`✅ 成功激活设置内容: ${contentMap[tab]}`);
    } else {
        console.error(`❌ 找不到设置内容元素: ${contentMap[tab]}`);
    }

    console.log(`✅ 设置标签切换完成: ${tab} -> ${contentMap[tab]}`);
}

// 帮助页面标签切换
function switchHelpTab(tab, event) {
    console.log(`🔄 切换帮助标签: ${tab}`);

    // 只操作帮助页面内的标签
    const helpPage = document.getElementById('helpPage');
    if (!helpPage) {
        console.error('❌ 找不到helpPage元素');
        return;
    }

    // 更新标签状态 - 只在当前页面内查找
    const tabs = helpPage.querySelectorAll('.nav-tab');
    tabs.forEach(tabEl => {
        tabEl.classList.remove('active');
    });

    // 激活当前标签
    if (event && event.target) {
        event.target.classList.add('active');
    }

    // 更新内容显示
    document.querySelectorAll('.help-content').forEach(content => {
        content.classList.remove('active');
    });

    // 内容ID映射
    const contentMap = {
        'guide': 'guideContent',
        'faq': 'faqContent',
        'about': 'aboutContent'
    };

    const targetContent = document.getElementById(contentMap[tab]);
    if (targetContent) {
        targetContent.classList.add('active');
        console.log(`✅ 成功激活帮助内容: ${contentMap[tab]}`);
    } else {
        console.error(`❌ 找不到帮助内容元素: ${contentMap[tab]}`);
    }

    console.log(`✅ 帮助标签切换完成: ${tab} -> ${contentMap[tab]}`);
}

// 抖音模式切换
function switchMode(mode, event) {
    console.log(`🔄 调用switchMode: ${mode}`);

    if (typeof currentMode !== 'undefined') {
        currentMode = mode;
    }

    // 只操作抖音页面内的标签
    const douyinPage = document.getElementById('douyinPage');
    if (!douyinPage) {
        console.error('❌ 找不到douyinPage元素');
        return;
    }

    // 更新标签状态 - 只在当前页面内查找
    const tabs = douyinPage.querySelectorAll('.nav-tab');
    tabs.forEach(tab => {
        tab.classList.remove('active');
    });

    // 激活当前标签
    if (event && event.target) {
        event.target.classList.add('active');
    }

    // 更新输入框提示
    const videoUrlInput = document.getElementById('videoUrl');
    if (videoUrlInput) {
        const placeholder = mode === 'video' ?
            '粘贴抖音视频分享链接...' :
            '粘贴抖音图片分享链接...';
        videoUrlInput.placeholder = placeholder;
    }

    // 根据模式切换保存路径
    const savePathInput = document.getElementById('savePath');
    if (savePathInput) {
        const savePath = mode === 'video' ?
            'D:/douyin_downloads/videos' :
            'D:/douyin_downloads/images';
        savePathInput.value = savePath;
    }

    console.log(`✅ 抖音模式已切换: ${mode}`);
}

// 快手模式切换
function switchKuaishouMode(mode, event) {
    console.log(`🔄 切换快手模式: ${mode}`);

    // 阻止事件冒泡
    if (event) {
        event.preventDefault();
        event.stopPropagation();
    }

    // 只操作快手页面内的标签
    const kuaishouPage = document.getElementById('kuaishouPage');
    if (!kuaishouPage) {
        console.error('❌ 找不到kuaishouPage元素');
        return;
    }

    // 更新标签状态 - 只在当前页面内查找
    const tabs = kuaishouPage.querySelectorAll('.nav-tab');
    tabs.forEach(tab => {
        tab.classList.remove('active');
    });

    // 激活当前标签
    if (event && event.target) {
        event.target.classList.add('active');
    } else {
        // 如果没有event，根据mode找到对应的标签
        const tabMap = {
            'single': 0,
            'batch': 1
        };
        if (tabs[tabMap[mode]]) {
            tabs[tabMap[mode]].classList.add('active');
        }
    }

    // 更新内容显示 - 先隐藏所有内容
    document.querySelectorAll('.kuaishou-content').forEach(content => {
        content.classList.remove('active');
    });

    // 内容ID映射
    const contentMap = {
        'single': 'kuaishouSingle',
        'batch': 'kuaishouBatch'
    };

    const targetContentId = contentMap[mode];
    console.log(`🎯 目标内容ID: ${targetContentId}`);

    const targetContent = document.getElementById(targetContentId);
    console.log(`🔍 找到目标元素:`, !!targetContent);

    if (targetContent) {
        // 直接添加active类
        targetContent.classList.add('active');
        console.log(`✅ 成功激活内容: ${targetContentId}`);

        // 验证激活状态
        const isActive = targetContent.classList.contains('active');
        const displayStyle = getComputedStyle(targetContent).display;
        console.log(`📊 激活验证:`, { isActive, displayStyle });
    } else {
        console.error(`❌ 找不到内容元素: ${targetContentId}`);
        // 列出所有kuaishou-content元素
        const allKuaishouContents = document.querySelectorAll('.kuaishou-content');
        console.log('🔍 所有kuaishou-content元素:', Array.from(allKuaishouContents).map(el => el.id));
    }

    console.log(`✅ 快手模式切换完成: ${mode} -> ${targetContentId}`);
}

// 初始化页面内容显示
function initializePageContent() {
    console.log('🔄 初始化页面内容显示...');

    // 初始化快手页面，默认显示单视频解析
    const kuaishouSingle = document.getElementById('kuaishouSingle');
    if (kuaishouSingle) {
        kuaishouSingle.classList.add('active');
        console.log('✅ 默认激活快手单视频解析模式');
    } else {
        console.error('❌ 找不到kuaishouSingle元素');
    }

    // 初始化付费解析区，默认显示单页解析
    const vmqSingle = document.getElementById('vmqSingle');
    if (vmqSingle) {
        vmqSingle.classList.add('active');
        console.log('✅ 默认激活付费解析区单页模式');
    } else {
        console.error('❌ 找不到vmqSingle元素');
    }

    // 初始化设置页面，默认显示代理设置
    const proxySettings = document.getElementById('proxySettings');
    if (proxySettings) {
        proxySettings.classList.add('active');
        console.log('✅ 默认激活代理设置');
    } else {
        console.error('❌ 找不到proxySettings元素');
    }

    // 初始化帮助页面，默认显示使用指南
    const guideContent = document.getElementById('guideContent');
    if (guideContent) {
        guideContent.classList.add('active');
        console.log('✅ 默认激活使用指南');
    } else {
        console.error('❌ 找不到guideContent元素');
    }
}

// 测试铁粉圈视频页面显示
function testTiefenquanVideo() {
    console.log('🧪 测试铁粉圈视频页面显示...');

    // 直接激活铁粉圈视频内容
    const tiefenquanVideo = document.getElementById('vmqTiefenquanVideo');
    if (tiefenquanVideo) {
        // 先隐藏所有vmq-content
        document.querySelectorAll('.vmq-content').forEach(content => {
            content.classList.remove('active');
        });

        // 激活铁粉圈视频
        tiefenquanVideo.classList.add('active');

        console.log('✅ 铁粉圈视频页面已激活');
        console.log('📊 元素状态:', {
            id: tiefenquanVideo.id,
            classes: tiefenquanVideo.className,
            display: getComputedStyle(tiefenquanVideo).display,
            visibility: getComputedStyle(tiefenquanVideo).visibility
        });
    } else {
        console.error('❌ 找不到vmqTiefenquanVideo元素');
    }
}

// 确保所有函数在全局作用域中可用
window.switchMode = switchMode;
window.switchKuaishouMode = switchKuaishouMode;
window.switchVmqMode = switchVmqMode;
window.switchSettingsTab = switchSettingsTab;
window.switchHelpTab = switchHelpTab;
window.performPageSwitch = performPageSwitch;
window.initializePageContent = initializePageContent;
window.testTiefenquanVideo = testTiefenquanVideo;

// 兼容旧的函数名
function switchDouyinMode(mode) {
    switchMode(mode);
}
